<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" >
<head>
    <th:block th:include="include :: header('修改订单管理')" />
    <th:block th:include="include :: datetimepicker-css" />
</head>
<body class="white-bg">
<div class="wrapper wrapper-content animated fadeInRight ibox-content">
    <form class="form-horizontal m" id="form-order-edit" th:object="${order}">
        <input name="orderId" th:field="${order.orderId}" type="hidden">
        <div class="form-group">
            <label class="col-sm-3 control-label is-required">车辆编号：</label>
            <div class="col-sm-8">
                <input name="carId" th:field="${car.carId}" class="form-control" type="text" readonly>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label is-required">车牌号：</label>
            <div class="col-sm-8">
                <input name="carLisenseNum" th:field="${car.carLisenseNum}" class="form-control" type="text" readonly>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label is-required">车辆型号：</label>
            <div class="col-sm-8">
                <input name="carModel" th:field="${car.carModel}" class="form-control" type="text" readonly>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label is-required">车辆颜色：</label>
            <div class="col-sm-8">
                <input name="carColor" th:field="${car.carColor}" class="form-control" type="text" readonly>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label is-required">客户编号：</label>
            <div class="col-sm-8">
                <input name="custNo" th:field="${customer.custNo}" class="form-control" type="text" readonly>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label is-required">客户姓名：</label>
            <div class="col-sm-8">
                <input name="custName" th:field="${customer.custName}" class="form-control" type="text" readonly>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label is-required">客户手机号：</label>
            <div class="col-sm-8">
                <input name="custPhone" th:field="${customer.custPhone}" class="form-control" type="text" readonly>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label is-required">租车时间：</label>
            <div class="col-sm-8">
                <div class="input-group date">
                    <input id="rentTime" name="rentTime" th:value="${#dates.format(order.rentTime, 'yyyy-MM-dd HH:mm')}" class="form-control" placeholder="yyyy-MM-dd HH:mm" type="text">
                    <span class="input-group-addon"><i class="fa fa-calendar"></i></span>
                </div>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label is-required">预计还车时间：</label>
            <div class="col-sm-8">
                <div class="input-group date">
                    <input id="expectReturnTime" name="expectReturnTime" th:value="${#dates.format(order.expectReturnTime, 'yyyy-MM-dd HH:mm')}" class="form-control" placeholder="yyyy-MM-dd HH:mm" type="text">
                    <span class="input-group-addon"><i class="fa fa-calendar"></i></span>
                </div>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label is-required">按天单价：</label>
            <div class="col-sm-8">
                <input name="dayPrice" th:field="${order.dayPrice}" class="form-control" type="text" readonly>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label is-required">超时单价/时：</label>
            <div class="col-sm-8">
                <input name="delayHourPrice" th:field="${order.delayHourPrice}" class="form-control" type="text" readonly>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label is-required">超时单价/天：</label>
            <div class="col-sm-8">
                <input name="delayDayPrice" th:field="${order.delayDayPrice}" class="form-control" type="text" readonly>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label is-required">押金：</label>
            <div class="col-sm-8">
                <input name="deposit" th:field="${order.deposit}" class="form-control" type="text" >
            </div>
        </div>
    </form>
</div>
<th:block th:include="include :: footer" />
<th:block th:include="include :: datetimepicker-js" />
<script th:inline="javascript">
    var prefix = ctx + "lease/custorder";

    jQuery.validator.addMethod("dateCheck", function() {
        var startDate = $('#rentTime').val();
        var endDate = $('#expectReturnTime').val();
        try {
            var startTimeDate = new Date(Date.parse(startDate.replace(/-/g, "/"))).getTime();
            var endTimeDate = new Date(Date.parse(endDate.replace(/-/g, "/"))).getTime();
            if (endTimeDate > startTimeDate) {
                return true
            } else {
                return false
            }
        } catch (e) {
            return false
        }
    });
    jQuery.validator.addMethod("dateCheck1", function() {
        let startDate = $('#rentTime').val();
        if (startDate == ''){
            return false
        }
        try {
            let startTimeDate = new Date(Date.parse(startDate.replace(/-/g, "/"))).getTime();
            if (startTimeDate) {
                return true
            } else {
                return false
            }
        } catch (e) {
            return false
        }
    });
    jQuery.validator.addMethod("dateCheck2", function() {
        let endDate = $('#expectReturnTime').val();
        if (endDate == '') {
            return false
        }
        try {
            let TimeDate = new Date(Date.parse(endDate.replace(/-/g, "/"))).getTime();
            if (TimeDate) {
                return true
            } else {
                return false
            }
        } catch (e) {
            return false
        }
    });
    $("#form-order-edit").validate({
        focusCleanup: true,
        rules: {
            rentTime: {
                dateCheck1: true,
            },
            expectReturnTime: {
                dateCheck2: true,
                dateCheck: true
            },
            dayPrice: "required",
            delayHourPrice: "required",
            delayDayPrice: "required",
            deposit: "required",
        },
        messages: {
            rentTime: {
                dateCheck1: icon + "请选择租出时间"
            },
            expectReturnTime: {
                dateCheck2: icon + "请选择预计还车时间",
                dateCheck: icon + "预计还车时间需大于租出时间"
            },
            dayPrice: icon + "请输入按天单价",
            delayHourPrice: icon + "请输入超时单价/时",
            delayDayPrice: icon + "请输入超时单价/天",
            deposit: icon + "请输入押金",
        }
    });

    function submitHandler() {
        if ($.validate.form()) {
            $.operate.save(prefix + "/edit", $('#form-order-edit').serialize());
        }
    }

    $("#rentTime").datetimepicker({
        format: "yyyy-mm-dd hh:ii",
        autoclose: true
    });

    $("#expectReturnTime").datetimepicker({
        format: "yyyy-mm-dd hh:ii",
        autoclose: true
    });
</script>
</body>
</html>